import 'package:flutter/material.dart';
import '../utils/base.dart';
import 'styles.dart';

class XTable<T> extends StatelessWidget {
  final List<String> columns;
  final List<List<XTableCell>> data;

  const XTable({Key key, this.columns, this.data}) : super(key: key);

  TextStyle _tableHeaderTextStyle() {
    return TextStyle(
      color: HexColor("333333"),
      decoration: TextDecoration.none,
      fontSize: Design.px(30),
    );
  }

  @override
  Widget build(BuildContext context) {
    List<List<Widget>> list =
        data.map((row) => row.map((cell) => cell.build()).toList()).toList();

    List<List<Widget>> columRow = [];
    columRow.add(this
        .columns
        .map((c) => Container(
              padding: EdgeInsets.symmetric(vertical: Design.px(48)),
              decoration: BoxDecoration(
                color: HexColor('f8f8f8'),
                border: Border(
                  top:  BorderSide(
                    width: 1,
                    color: HexColor('d5d5d5'),
                  ),
                  bottom: BorderSide(
                    width: 1,
                    color: HexColor('d5d5d5'),
                  ),
                ),
              ),
              child: Text(
                c,
                textAlign: TextAlign.center,
                style: _tableHeaderTextStyle(),
              ),
            ))
        .toList());

    return Column(
      children: <Widget>[
        Table(
          children: columRow.map((t) => TableRow(children: t)).toList(),
        ),
        Expanded(
          child: ListView(
            children: <Widget>[
              Container(
                decoration: BoxDecoration(color: Colors.white),
                child: Table(
                  children: list.map((t) => TableRow(children: t)).toList(),
                ),
              ),
            ],
          ),
        )
      ],
    );
  }
}

enum XTableCellType { text, button }

class XTableCell {
  final String data;

  final XTableCellType type;

  XTableCell({this.data, this.type});

  TextStyle _tableBodyTextStyle() {
    return TextStyle(
      color: HexColor("333333"),
      decoration: TextDecoration.none,
      fontSize: Design.px(30),
    );
  }

  Widget build() {
    Widget _cell(Widget content) {
      return Container(
        height: Design.px(100),
        alignment: Alignment.center,
        decoration: BoxDecoration(
          color: HexColor('ffffff'),
          border: Border(
            bottom: BorderSide(
              width: 1,
              color: HexColor('d5d5d5'),
            ),
          ),
        ),
        child: content,
      );
    }

    if (type == XTableCellType.button) {
      return _cell(Text(
        '[${data}]',
        style: _tableBodyTextStyle(),
      ));
    } else {
      return _cell(Text(
        '${data}',
        style: _tableBodyTextStyle(),
      ));
    }
  }
}
